<template>
    <div class="city">
        <my-header :city="cityName"></my-header>
        <!-- 轮播图 -->
        <div class="carousel">
            <el-carousel>
                <el-carousel-item v-for="(item) in carouselImg" :key="item.index">
                <img :src="item.url" alt="">
                </el-carousel-item>
            </el-carousel>
        </div>

		<div class="tourism">		
			<div class="lvyou">
				<p>广东省博物馆</p>
				<div class="jingdian">广东省博物馆位于广州市天河区珠江新城中心区南部，1957年开始筹建，1959年正式开放。
				广东省博物馆新馆于2004年12月奠基开工，2010年建成，占地面积6.7万平方米，是广东省的省级综合博物馆。
				广东省博物馆宝盒形状的外观十分显眼,主要展示广东的历史文化、民风民俗、艺术和自然。</div>
			</div>
			<div class="lvyou">
				<p>白云山</p>
				<div class="jingdian">白云山已建设成为的国家级风景名胜区和旅游景区。白云山风景区从南至北共有7个游览区，
				依次是：麓湖景区、三台岭景区、鸣春谷景区、摩星岭景区、明珠楼景区、飞鹅岭景区及荷依岭景区，区内有三个全国之最的景点，
				分别是：全国最大的园林式花园——云台花园；全国最大的天然式鸟笼——鸣春谷；全国最大的主题式雕塑专类公园——雕塑公园。</div>
			</div>
			<div class="lvyou">
				<p>广州塔</p>
				<div class="jingdian">广州塔（英语：Canton Tower）又称广州新电视塔，昵称小蛮腰，其位于中国广东省广州市海珠区（艺洲岛）赤岗塔附近，
				距离珠江南岸125米，与珠江新城、花城广场、海心沙岛隔江相望。广州塔塔身主体高454米，天线桅杆高146米，总高度600米。是中国第一高塔，
				是国家AAAA级旅游景区。广州塔塔身168~334.4米处设有“蜘蛛侠栈道”，是世界最高最长的空中漫步云梯。塔身422.8米处设有旋转餐厅，是世界最高的旋转餐厅。</div>
			</div>
		</div>



        <!-- 这个是地方美食的轮播图   -->
        <div class="carouselMeishi">
            <el-carousel :interval="4000" type="card">
                <el-carousel-item v-for="(item) in carouselMeishi" :key="item.index">
                <img :src="item.url" alt="">
                </el-carousel-item>
            </el-carousel>
        </div>

		<div class="food">
			<div class="meishi">
				<p>广式早茶</p>
				<div class="msjieshao">
					一提到广州，“早茶”以其多种多样、纷繁复杂、精致美味的茶点闻名于大江南北。茶楼的早市清晨四点左右开门。
					配茶的点心除广东人爱吃的干蒸马蹄糕、糯米鸡等外，还有著名的早茶四件套干蒸烧卖、水晶虾饺、鲍汁凤爪、豉汁排骨...
				</div>
			</div>
			<div class="meishi">
				<p>白切鸡</p>
				<div class="msjieshao">
					广州人吃白切鸡时，大多是以姜、葱、酱油等配制的调料佐餐，吃起来比较清淡，让人容易接受，因此容易让人觉得好像白切鸡
					只是蘸姜葱汁料进食的。其实不然，光是煮鸡的汤料中就大有讲究，在水中加入料酒、姜片、枸杞等药材，使鸡肉更加美味。
				</div>
			</div>
			<div class="meishi">
				<p>烧鹅</p>
				<div class="msjieshao">
					广式烧鹅，属粤菜系。鹅以中、小个的清远黑棕鹅为优，去翼、脚、内脏的整鹅，吹气，涂五香料，缝肚，滚水烫皮，过冷水，
					糖水匀皮，晾风而后腌制，最后挂在烤炉里或明火上转动烤成，色香味俱全，色泽金红，鹅体饱满，且腹含卤汁，滋味醇厚。
				</div>
			</div>
		</div>

        <my-footer></my-footer>
           
    </div>
</template>

<script>
export default {
    name: 'Guangzhou',
    data() {
        return {
            carouselImg:[
                { url: require("@/assets/guangzhou/guangzhou01.jpg")},
                { url: require("@/assets/guangzhou/guangzhou02.jpg")},
				{ url: require("@/assets/guangzhou/guangzhou03.png")},
            ],
            carouselMeishi:[
                { url: require("@/assets/guangzhou/guangzhou06.jpg")},
                { url: require("@/assets/guangzhou/guangzhou04.jpg")},
                { url: require("@/assets/guangzhou/guangzhou05.jpg")},

            ],
            cityName:'广州'
        }
    },
    beforeRouteLeave(to,from,next){
      to.meta.keepAlive = true
      next(0)
    }
    

};
</script>

<style scoped>
.carousel {
    width: 800px;
    height: 360px;
    margin: 50px auto;
	margin-bottom: 10px;
}
.carousel img{
	max-width: 100%;
}
.carouselMeishi {
    margin: 0 auto;
    width: 1000px;
}
.carouselMeishi img {
    max-width: 100%;
    min-width: 100%;
}
.tourism {
    width: 1000px;
    height: 350px;
    margin: 0 auto;
    font-family: NSimSun;

}
.food {
    width: 1000px;
    height: 300px;
    margin: 50px auto;
    font-family: NSimSun;

}
.lvyou{
	width: 330px;
	height: 300px;
	float: left;
	border-left: #999999 dashed 1px;
	border-right: #999999 dashed 1px;
}
.lvyou p{
	font-size: 28px;
	font-weight: bold;
	font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
	display: block;
}
.jingdian{
	text-indent: 28px;
	margin-left: 26px;
	margin-right: 26px;
	font-size: 16px;
	font-weight: bold;
}
.meishi{
	margin-top: 20px;
	width:310px;
	height: 250px;
	float: left;
	background-color: #b8d8ff;
	opacity: 0.8;
	border-radius: 25px;
	margin-left: 15px;
}
.meishi p{
	font-size: 28px;
	font-weight: bold;
	font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
	display: block;
	color: #000000;
}
.msjieshao{
	color: #000000;
	font-weight: bold;
}
</style>